<!DOCTYPE html>
<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>设置上边框的样式</title>
    <style>
        p {
            border-style: solid;
        }

        p.none {
            border-top-style: none;
        }

        p.dotted {
            border-top-style: dotted;
        }

        p.dashed {
            border-top-style: dashed;
        }

        p.solid {
            border-top-style: solid;
        }

        p.double {
            border-top-style: double;
        }

        p.groove {
            border-top-style: groove;
        }

        p.ridge {
            border-top-style: ridge;
        }

        p.inset {
            border-top-style: inset;
        }

        p.outset {
            border-top-style: outset;
        }
    </style>
</head>

<body>
    <p class="none">无上底边界。</p>
    <p class="dotted">点上底边界。</p>
    <p class="dashed">虚线上底边界。</p>
    <p class="solid">实线上底边界。</p>
    <p class="double">双线上底边界。</p>
    <p class="groove">凹槽上底边界。</p>
    <p class="ridge">垄状上底边界。</p>
    <p class="inset">嵌入上底边界。</p>
    <p class="outset">外凸上底边界。</p>
</body>

</html>